<template>
  <div class="total">
 <header>
     <van-nav-bar
  left-arrow
  @click-left="onClickLeft"
  
/>
 </header>
 <!-- 页面布局 -->
 <div class="cent">
   <ul>
     <li> <p>客户</p><i>1</i></li>
     <li> <p>商品</p><i>1</i></li>
     <li> <p>数量</p><i>1</i></li>
     <li> <p>下单人</p><i>1</i></li>
     <li> <p>下单时间</p><i>1</i></li>
   </ul>
 </div>
 <div class="center"> 
   <van-field v-model="value1" label="收货人" placeholder="请输入用户名" />
     <van-field v-model="value2" label="联系电话" placeholder="请输入用户名" />
     <van-field v-model="value3" label="收货地址"  type="textarea" rows="4" autosize placeholder="请输入用户名" />
     <van-field v-model="value4" label="物流单号" placeholder="请输入用户名" />
 </div>
 <div class="bottom">
   <van-button type="primary" round @click="diliver" >确认发货</van-button>
 </div>
  </div>
</template>

<script>
import {send} from '../../request/api'
export default {
data(){
  return{
    value1:'',
    value2:'',
    value3:'',
    value4:''
  }
},
created(){
     console.log(this.$route.params.id);

},

 methods: {
    onClickLeft() {
     this.$router.go(-1)
    },  
    diliver(){
       console.log(this.value2);
       send({
         serialNo:this.$route.params.id,
         receiver:this.value1,
         linkPhone:this.value2,
         address:this.value3,
         logisticsCode:this.value4
       }).then(res=>{
         console.log(res.message);
       })
    }
    
  },
}
</script>

<style lang='less' >
*{
    font-size: .18rem!important;
}
.total{
  background-color: #f5f5f5;
}
header{
    background: #003399;
    .van-nav-bar{background:#003399;
font-size: .2rem;
padding:3% 0 0;
.van-icon{
    font-size: .2rem;
    color: white;
}
     }
    
}
.cent{
  background: white;
  margin: 3% 0;
  ul{
    margin: 0  4%;
     li{
    line-height: .45rem;
    display: flex;
    justify-content:space-between;
    
  }
  }
 
}
.center{
   background: white;
  margin: 3% 0;
  span{
    color:black
  }
  input{
    border-radius: 4px;
    background-color: #ececec;
  }
  textarea{
       border-radius: 4px;
    background-color: #ececec;
  }
}

.bottom{
  // background: white;
  position: absolute;
  width: 100%;
  bottom: .1rem;
  .van-button{
  margin: .1rem .15rem;
  width: 92%;
}
}
</style>